import uniqueId from '@form-create/utils/lib/unique';
import {localeProps, makeOptionsRule, makeRequiredRule} from '../../utils/index';

const label = '下拉选择';
const name = 'jd-select';

export default {
    icon: 'icon-select',
    label,
    name,
    rule({t}) {
        const opt = t('props.option');
        return {
            type: 'select',
            field: 'XLXX',
            title: '下拉选择',
            info: '',
            effect: {
                fetch: ''
            },
            $required: false,
            validate: false,
            style: { width: '100%'},
            props: {
                filterable: true,
                clearable: true
            },
            options: [1, 2].map(value => {
                return {
                    label: opt + value,
                    value,
                }
            })
        };
    },
    watch: {
        'multiple': function(val){
            val.rule.key = uniqueId();
            if (val.value){
                val.api.rule[4].hidden = false;
            } else {
                val.api.rule[4].hidden = true;
            }
        }
    },
    props(_, {t}) {
        return localeProps(t, name + '.props', [
            makeRequiredRule(),
            {
                type: 'col',
                props: {span: 12},
                children: [
                    {type: 'switch', field: 'disabled', title: '是否禁用', value: false} 
                ]
            },
            {
                type: 'col',
                props: {span: 12},
                children: [
                    {type: 'switch', field: 'multiple', title: '支持多选'}
                ]
            },
            {type: 'input', field: 'placeholder', title: '占位文本'},
            {
                type: 'row',
                props: {gutter: 5},
                hidden: true,
                children: [
                    {
                        type: 'col',
                        props: {span: 12},
                        children: [
                            {type: 'switch',field: 'collapseTags',title: '值合并显示'}
                        ]
                    },
                    {
                        type: 'col',
                        props: {span: 12},
                        children: [
                            {type: 'inputNumber', field: 'multipleLimit', title: '最多可选(个)', props: {min: 0, controls: false}}
                        ]
                    }
                ]
            },
            makeOptionsRule(t, 'options')
        ])
    }
};
